<template>
  <div class="myResetPsw-box">
    <el-row style="margin-bottom: 40px">
      <el-col>更改密码</el-col>
    </el-row>
    <el-row>
      <el-col :span="8" :offset="6">
        <el-form
          ref="resetPswForm"
          :model="resetPswForm"
          :rules="rules"
          label-width="140px"
          size="small">
          <el-form-item label="原密码：" prop="oldPsw">
            <el-input type="text" v-model="resetPswForm.oldPsw" placeholder="原密码" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="新密码：" prop="newPsw">
            <el-input type="password" v-model="resetPswForm.newPsw" placeholder="新密码" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="确认新密码：" prop="repeatPsw">
            <el-input type="password" v-model="resetPswForm.repeatPsw" placeholder="重复新密码" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item style="text-align: right;">
            <el-button type="primary" @click="submit">提交更改</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'MyResetPsw',
  data () {
    /* 验证规则部分 S */
    let validateOld = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入原密码'));
      } else {
        callback();
      }
    }
    let validatePass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入新密码'));
      } else {
        if (this.resetPswForm.repeatPsw !== '') {
          this.$refs.resetPswForm.validateField('repeatPsw');
        }
        callback();
      }
    };
    let validatePass2 = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请再次输入密码'));
      } else if (value !== this.resetPswForm.newPsw) {
        callback(new Error('两次输入密码不一致!'));
      } else {
        callback();
      }
    };
    /* 验证规则部分 E */

    return {
      resetPswForm: {
        oldPsw: '',
        newPsw: '',
        repeatPsw: ''
      },
      rules: {
        oldPsw: [{ validator: validateOld, trigger: 'blur' }],
        newPsw: [{ validator: validatePass, trigger: 'blur'}],
        repeatPsw: [{ validator: validatePass2, trigger: 'blur'}]
      }
    }
  },
  methods: {

    submit () {
      console.log(this.registerForm)
      console.log(this.resetPswForm)
      let parinfo=this.resetPswForm;
      this.$refs.resetPswForm.validate((valid) => {
        if (valid) {
//        this.$message.info({
//          message: `提交更改`
//        })
						this.$API.resetPsw({'orig_password' :parinfo.oldPsw,'password' :parinfo.newPsw,'password_confirmation':parinfo.repeatPsw})
						.then(data => {
							console.log(data)
							this.$message.info({
			            message: `密码更改成功`
							})
						})
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    }
  }
}
</script>
